﻿<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="QUNhomQuyenByToChuc_Detail.ascx.cs"
    Inherits="DemoExtNet.PhanQuyen.UserControls.QUNhomQuyenByToChuc_Detail" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<ext:XScript runat="server">
    <script type="text/javascript">
        function NodeSelected(){
            var node=#{TreeGrid1}.getSelectionModel().getSelectedNode();
            if(node.parentNode.text=='ToChuc'){
                #{btnEditRole}.enable();
                return ;
            }
           if(eval(node.parentNode.attributes.IsModuleConThuaKe)){
                #{btnEditRole}.disable();
            }
            else{
                #{btnEditRole}.enable();    
            }          
        }
    
        function ShowEditRoleDialog() {
            var node=#{TreeGrid1}.getSelectionModel().getSelectedNode();
            #{lblTenToChuc}.setText(node.attributes.TenToChuc);
            #{chkIsView}.setValue(node.attributes.IsView);
            #{chkIsAdd}.setValue(node.attributes.IsAdd);
            #{chkIsEdit}.setValue(node.attributes.IsEdit);
            #{chkIsDelete}.setValue(node.attributes.IsDelete);
            #{chkIsModuleConThuaKe}.setValue(node.attributes.IsModuleConThuaKe);
            
            #{wdEditRole}.show();
        }
        
        function UpdateTreeGrid()
        {
            var currentNode=#{TreeGrid1}.getSelectionModel().getSelectedNode();
            UpdateNode(currentNode,#{chkIsView}.getValue(),#{chkIsAdd}.getValue(),#{chkIsEdit}.getValue(),#{chkIsDelete}.getValue(),#{chkIsModuleConThuaKe}.getValue());
            #{wdEditRole}.hide();
            #{btnSaveTree}.enable();
        }
        
        function UpdateNode(node,IsView,IsAdd,IsEdit,IsDelete,IsModuleConThuaKe)
        {
            //update data
            node.attributes.IsView=IsView;
            node.attributes.IsAdd=IsAdd;
            node.attributes.IsEdit=IsEdit;
            node.attributes.IsDelete=IsDelete;
            node.attributes.IsModuleConThuaKe=IsModuleConThuaKe;
            //Sync GUI
            SyncGUI(node);
            //
            if(!IsModuleConThuaKe)
            {
                return ;
            }
            
            if (!node.hasChildNodes()){
                return ;
            }            
            node.expand();
            //sync children
            var i = 0;
            for(i = 0 ; i < node.childNodes.length ; i++)
            {   //Sync Column
                UpdateNode(node.childNodes[i],IsView,IsAdd,IsEdit,IsDelete,IsModuleConThuaKe);
            }
        }
        
        function SyncGUI(node){
           var nodeEl = Ext.get(#{TreeGrid1}.getNodeById(node.id).ui.elNode),
                columns = nodeEl.select(".x-treegrid-text", true),
                columnIsView = columns.item(0),
                columnIsAdd = columns.item(1);
                columnIsEdit = columns.item(2);
                columnIsDelete = columns.item(3);
                columnIsModuleConThuaKe = columns.item(4);
                
               UpdateColumn(columnIsView,node.attributes.IsView);
               UpdateColumn(columnIsAdd,node.attributes.IsAdd);
               UpdateColumn(columnIsEdit,node.attributes.IsEdit);
               UpdateColumn(columnIsDelete,node.attributes.IsDelete);
               UpdateColumn(columnIsModuleConThuaKe,node.attributes.IsModuleConThuaKe);
        }        

        var UpdateColumn = function(column,checked)
        {
            if(checked)
            {
                column.update("<div class='x-grid3-check-col-on x-grid3-cc-booleanCol'>&nbsp;</div>");
            }
            else 
            {
                column.update("<div class='x-grid3-check-col x-grid3-cc-booleanCol'>&nbsp;</div>");
            }
        }
        
        var refreshTree = function (tree,result) {            
            var nodes = eval(result);
            if(nodes.length > 0){
                tree.initChildren(nodes);
            }
            else{
                tree.getRootNode().removeChildren();
            }
        }
        
        function grdNguoiDung_Command(command,record)
        {
            if(command == 'Delete')
            {
                Ext.MessageBox.show({
                   title: 'Confirm',
                   msg: 'Bạn có chắc chắn xóa record này ko?',
                   icon: Ext.MessageBox.QUESTION,
                   buttons: Ext.MessageBox.YESNO,
                   fn: function(btn)
                   {
                    if(btn.toLowerCase()=='yes')
                    {
                        //Do Yes
                        #{DirectMethods}.RemoveNguoiDung(record.id);
                    }
                   }
                });
            }
        
        }        
     
    </script>
</ext:XScript>

<ext:Hidden ID="__NhomQuyenByToChucId" runat="server" Text=""></ext:Hidden>
<ext:Window ID="wdQUNhomQuyenByToChuc_Detail" runat="server" Width="650" AutoHeight="true"
    Modal="true" Resizable="false" Hidden="true" Border="false">
    <Items>
        <ext:Panel ID="pnlDetail" runat="server" Height="50" Border="false">
            <Content>
                <br />
                <table style="margin-left:20px;">
                    <tr>
                        <td><b>Tên Nhóm Quyền :</b></td>
                        <td><ext:Label ID="lblTenNhomQuyen" runat="server" Text=""></ext:Label></td>
                    </tr>
                     <tr>
                        <td><b>Ghi Chú :</b></td>
                        <td><ext:Label ID="lblGhiChu" runat="server" Text=""></ext:Label></td>
                    </tr>
                </table>
                <br />
            </Content>
        </ext:Panel>
        <ext:TabPanel ID="tabDetail" runat="server" Width="640" Height="400">
            <Items>
                <ext:Panel ID="tabNguoiDung" runat="server" Title="Người Dùng" Layout="Fit" MonitorResize="true">
                    <Items>
                        <ext:GridPanel ID="grdNguoiDung" runat="server" AutoExpandColumn="TenDangNhap">
                            <Store>
                                <ext:Store ID="storeNguoiDung" runat="server">
                                    <Reader>
                                        <ext:JsonReader IDProperty="NguoiDungID">
                                            <Fields>
                                                <ext:RecordField Name="TenDangNhap" />
                                            </Fields>
                                        </ext:JsonReader>
                                    </Reader>
                                </ext:Store>
                            </Store>
                            <ColumnModel>
                                <Columns>
                                     <ext:RowNumbererColumn />
                                    <ext:CommandColumn Width="50">
                                        <Commands>
                                            <ext:SplitCommand>
                                                <Menu>
                                                    <Items>
                                                        <ext:MenuCommand Text="Xóa" CommandName="Delete" />
                                                    </Items>
                                                </Menu>
                                            </ext:SplitCommand>
                                        </Commands>
                                    </ext:CommandColumn>
                                   
                                    <ext:Column Header="Tên Đăng Nhập" DataIndex="TenDangNhap">
                                    </ext:Column>
                                </Columns>
                            </ColumnModel>
                            <TopBar>
                                <ext:Toolbar ID="Toolbar1" runat="server">
                                    <Items>
                                        <ext:Button runat="server" Icon="Add" ID="btnShowDialogAddNguoiDung" Text="Thêm Người Dùng">
                                            <DirectEvents>
                                                <Click OnEvent="btnShowDialogAddNguoiDung_Click">
                                                </Click>
                                            </DirectEvents>
                                        </ext:Button>
                                    </Items>
                                </ext:Toolbar>
                            </TopBar>
                            <BottomBar>
                                <ext:PagingToolbar ID="PagingToolbar1" runat="server" PageSize="10" PageIndex="1" />
                            </BottomBar>
                            <Listeners>
                                <Command Handler="grdNguoiDung_Command(command,record);" />
                            </Listeners>
                        </ext:GridPanel>
                    </Items>
                </ext:Panel>
                <ext:Panel ID="tabToChuc" runat="server" Title="Tổ Chức" Layout="Fit" MonitorResize="true">
                    <Items>
                        <ext:TreeGrid ID="TreeGrid1" runat="server"  OnSubmit="SubmitNodes" 
                            Height="300" NoLeafIcon="true" EnableDD="true" EnableHdMenu="false" EnableSort="false">
                            <TopBar>
                                <ext:Toolbar ID="Toolbar2" runat="server">
                                    <Items>
                                        <ext:Button ID="btnEditRole" Icon="ApplicationEdit" runat="server" Text="Edit" Disabled="true">
                                            <Listeners>
                                                <Click Handler="ShowEditRoleDialog();" />
                                            </Listeners>
                                        </ext:Button>
                                        <ext:Button ID="btnSaveTree" Icon="Disk" runat="server" Text="Save">
                                            <Listeners>
                                                <Click Handler="#{TreeGrid1}.submitNodes();" />
                                            </Listeners>
                                        </ext:Button>
                                    </Items>
                                </ext:Toolbar>
                            </TopBar>
                            <SelectionModel>
                                <ext:DefaultSelectionModel ID="DefaultSelectionModel1" runat="server">
                                    <Listeners>
                                        <SelectionChange Handler="NodeSelected(); " />
                                    </Listeners>
                                </ext:DefaultSelectionModel>
                            </SelectionModel>
                            <Columns>
                                <ext:TreeGridColumn Header="Tên Tổ Chức" Width="230" DataIndex="TenToChuc" />
                                <ext:TreeGridColumn Header="Xem" Width="60" DataIndex="IsView" Align="Center" >
                                    <XTemplate ID="XTemplate1" runat="server">
                                        <Html>
                                        <tpl for=".">
                                             <tpl if="IsView == 'true'"><div class="x-grid3-check-col-on x-grid3-cc-booleanCol">&nbsp;</div></tpl>
                                             <tpl if="IsView == 'false'"><div class="x-grid3-check-col x-grid3-cc-booleanCol">&nbsp;</div></tpl>
                                        </tpl>
                                        </Html>
                                    </XTemplate>
                                </ext:TreeGridColumn>
                                <ext:TreeGridColumn Header="Thêm" Width="60" DataIndex="IsAdd" Align="Center" >
                                    <XTemplate ID="XTemplate2" runat="server">
                                        <Html>
                                        <tpl for=".">
                                             <tpl if="IsAdd == 'true' "><div class="x-grid3-check-col-on x-grid3-cc-booleanCol">&nbsp;</div></tpl>
                                             <tpl if="IsAdd == 'false' "><div class="x-grid3-check-col x-grid3-cc-booleanCol">&nbsp;</div></tpl>
                                        </tpl>
                                        </Html>
                                    </XTemplate>
                                </ext:TreeGridColumn>
                                <ext:TreeGridColumn Header="Sửa" Width="60" DataIndex="IsEdit" Align="Center" >
                                    <XTemplate ID="XTemplate3" runat="server">
                                        <Html>
                                        <tpl for=".">
                                             <tpl if="IsEdit == 'true'"><div class="x-grid3-check-col-on x-grid3-cc-booleanCol">&nbsp;</div></tpl>
                                             <tpl if="IsEdit == 'false'"><div class="x-grid3-check-col x-grid3-cc-booleanCol">&nbsp;</div></tpl>
                                        </tpl>
                                        </Html>
                                    </XTemplate>
                                </ext:TreeGridColumn>
                                <ext:TreeGridColumn Header="Xóa" Width="60" DataIndex="IsDelete" Align="Center" >
                                    <XTemplate ID="XTemplate4" runat="server">
                                        <Html>
                                        <tpl for=".">
                                             <tpl if="IsDelete == 'true' "><div class="x-grid3-check-col-on x-grid3-cc-booleanCol">&nbsp;</div></tpl>
                                             <tpl if="IsDelete == 'false' "><div class="x-grid3-check-col x-grid3-cc-booleanCol">&nbsp;</div></tpl>
                                        </tpl>
                                        </Html>
                                    </XTemplate>
                                </ext:TreeGridColumn>
                                <ext:TreeGridColumn Header="Thừa Kế" Width="60" DataIndex="IsModuleConThuaKe" Align="Center" >
                                    <XTemplate ID="XTemplate5" runat="server">
                                        <Html>
                                        <tpl for=".">
                                             <tpl if="IsModuleConThuaKe == 'true' "><div class="x-grid3-check-col-on x-grid3-cc-booleanCol">&nbsp;</div></tpl>
                                             <tpl if="IsModuleConThuaKe == 'false' "><div class="x-grid3-check-col x-grid3-cc-booleanCol">&nbsp;</div></tpl>
                                        </tpl>
                                        </Html>
                                    </XTemplate>
                                </ext:TreeGridColumn>
                            </Columns>
                            <Root>
                            </Root>
                        </ext:TreeGrid>
                    </Items>
                </ext:Panel>
            </Items>
        </ext:TabPanel>
        <ext:Toolbar runat="server">
            <Items>
                <ext:ToolbarFill runat="server" />
                <ext:Button ID="btnExit" runat="server" Text="Close" Icon="Cancel">
                    <Listeners>
                        <Click Handler="#{wdQUNhomQuyenByToChuc_Detail}.hide();" />
                    </Listeners>
                </ext:Button>
            </Items>
        </ext:Toolbar>
    </Items>
    <Listeners>
        <BeforeShow Handler="#{btnEditRole}.disable(); #{btnSaveTree}.disable();" />
    </Listeners>
</ext:Window>

<%--Window edit :NhomQuyenByToChuc-ToChuc--%>
<ext:Window ID="wdEditRole" Title="Edit" runat="server" Width="400" AutoHeight="true" Icon="ApplicationEdit"
    Modal="true" Hidden="true">
    <Content>
        <div align="center">
        <br />
         <table style="width:90%;text-align:center;" cellpadding="10" cellspacing="0" >
            <tr>
                <td colspan="5">
                    <h2><ext:Label ID="lblTenToChuc" runat="server"></ext:Label></h2>
                    <br />
                </td>
            </tr>
            <tr>
                <td>
                    Xem
                </td>
                <td>
                    Thêm
                </td>
               <td>
                   Sửa
               </td>
                <td>
                    Xóa
                </td>
                <td style="border-left:solid 1px;">
                    Thừa Kế 
                </td>
            </tr>
            <tr>
                <td>
                    <ext:Checkbox ID="chkIsView" runat="server" /> 
                </td>
                <td>
                    <ext:Checkbox ID="chkIsAdd" runat="server" />
                </td>
                <td>
                    <ext:Checkbox ID="chkIsEdit" runat="server" />
                </td>
                <td>
                    <ext:Checkbox ID="chkIsDelete" runat="server" />
                </td>
                <td style="border-left:solid 1px;">
                    <ext:Checkbox ID="chkIsModuleConThuaKe" runat="server" />
                </td>
            </tr>
            <tr>
                <td colspan="5" align="right">
                    <br />
                    <table>
                        <tr>
                            <td>
                                <ext:Button ID="btnOk" runat="server" Icon="Accept" Text="Ok" Width="60">
                                    <Listeners>
                                        <Click Handler="
                                            UpdateTreeGrid();
                                        " />
                                    </Listeners>
                                </ext:Button>
                            </td>
                            <td>
                                <ext:Button ID="btnCloseRole" runat="server" Icon="Cancel" Text="Cancel" >
                                    <Listeners>
                                        <Click Handler="#{wdEditRole}.hide();" />
                                    </Listeners>
                                </ext:Button>
                            </td>
                        </tr>
                    </table>
                </td>
            </tr>
        </table>
        <br />
        </div>
    </Content>
</ext:Window>
